<template>
  <chart-map :points="points" />
</template>

<script lang="ts">
import {defineComponent, reactive, toRefs} from 'vue'
import ChartMap from './draw'
import { StorageLocal,StorageSession } from "@/storage/storage";

export default defineComponent({
  props: {
    nodes: {
      type: Object,// 引用类型的话,默认值要为函数返回值的形式!!! 1.String 2.Number 3.Boolean 4.Array 5.Object 6.Date 7.Function 8.Symbol
      require: true
    },
    count: {
      type: Array,// 引用类型的话,默认值要为函数返回值的形式!!! 1.String 2.Number 3.Boolean 4.Array 5.Object 6.Date 7.Function 8.Symbol
      require: true
    },
  },
  components: {
    ChartMap
  },
  setup(props) {
    const {nodes} = toRefs(props)
    const nodeList = nodes.value
    // 定义响应式数据 data
    const state= reactive({
      points: [],
    });
    if(nodeList){
      nodeList.forEach((node,index) => {
        if(node && node.ip){
          const scatter = {name: node.nodeName, value: [node.longitude,node.latitude, node.ip]}
          state.points[index] = scatter
        }
      })
    }

    return {   ...toRefs(state) }
  }
})
</script>


<style lang="scss" scoped>

</style>
